﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <script type="text/javascript" src="jquery-1.6.2.min.js"></script>
    <script type="text/javascript" src="Lib/prototype.js"></script>
    <script type="text/javascript" src="engine.js"></script>
    <script type="text/javascript" src="Render.js"></script>
    <script type="text/javascript" src="Resource.js"></script>
    <script type="text/javascript" src="Settings.js"></script>
    <script type="text/javascript" src="Math/Vector2D.js"></script>
    <script type="text/javascript" src="Math/Math.js"></script>    
    <script type="text/javascript" src="Math/Mat2D.js"></script>
    <script type="text/javascript" src="Collision/Features.js"></script>
    <script type="text/javascript" src="Collision/ContactID.js"></script>
    
    <script type="text/javascript" src="Collision/ClipVertex.js"></script>
    <script type="text/javascript" src="Collision/ContactPoint.js"></script>
    <script type="text/javascript" src="Collision/Manifold.js"></script>
    <script type="text/javascript" src="Dynamic/Contact/ContactNode.js"></script>
    <script type="text/javascript" src="Dynamic/Contact/Contact.js"></script>
    <script type="text/javascript" src="Dynamic/Contact/PolyContact.js"></script>
    <script type="text/javascript" src="Dynamic/Contact/ContactConstraint.js"></script>
    <script type="text/javascript" src="Dynamic/Contact/ContactConstraintPoint.js"></script>
    <script type="text/javascript" src="Dynamic/Contact/ContactRegister.js"></script>
    <script type="text/javascript" src="Dynamic/Contact/ContactSolver.js"></script>
    <script type="text/javascript" src="Dynamic/Contact/NullContact.js"></script>
    <script type="text/javascript" src="Dynamic/Body.js"></script>
    <script type="text/javascript" src="Dynamic/BodyDef.js"></script>
    <script type="text/javascript" src="Dynamic/CollisionFilter.js"></script>
    <script type="text/javascript" src="Dynamic/ContactManager.js"></script>
    <script type="text/javascript" src="Dynamic/Island.js"></script>
    <script type="text/javascript" src="Dynamic/TimeStep.js"></script>
    <script type="text/javascript" src="Dynamic/World.js"></script>
    <script type="text/javascript" src="Collision/Pair.js"></script>
    <script type="text/javascript" src="Collision/PairCallBack.js"></script>
    <script type="text/javascript" src="Collision/Proxy.js"></script>
    <script type="text/javascript" src="Collision/OBB.js"></script>
    <script type="text/javascript" src="Collision/AABB.js"></script>
    <script type="text/javascript" src="Collision/Collision.js"></script>
    
    
    
    <script type="text/javascript" src="Collision/Shape/MassData.js"></script>
    <script type="text/javascript" src="Collision/Shape/ShapeDef.js"></script>
    <script type="text/javascript" src="Collision/Shape/PolyDef.js"></script>
    <script type="text/javascript" src="Collision/Shape/BoxDef.js"></script>
    <script type="text/javascript" src="Collision/Shape/Shape.js"></script>
    <script type="text/javascript" src="Collision/Shape/PolyShape.js"></script>
    <script type="text/javascript" src="Collision/Bound.js"></script>
    <script type="text/javascript" src="Collision/BoundValues.js"></script>
    
    <script type="text/javascript" src="Collision/BufferedPair.js"></script>
    <script type="text/javascript" src="Collision/PairManager.js"></script>
    <script type="text/javascript" src="Collision/BroadPhase.js"></script>
    <script type="text/javascript" src="draw_world.js"></script>
</head>
<body>
<canvas id="canvas" width="1000" height="400" style="background-color: #338; border: solid 1px black"></canvas>
<div style="float: right; width: 400px; border: solid 1.1px #ccc">
World Information:
<div>
Body Count:<span id="world_bodycount"></span>
</div>
<div>
Contact Count:<span id="world_contactcount"></span>
</div>
</div>
<div id="FPS"></div>
<script type="text/javascript">
  function createGround(world) {
    var groundSd = new $.Engine.Collision.Shape.BoxDef();
    groundSd.extents.Set(500, 10);
    groundSd.restitution = 0.5;
    var groundBd = new $.Engine.Dynamic.BodyDef();
    groundBd.AddShape(groundSd);
    groundBd.position.Set(500,390);
    return world.CreateBody(groundBd)
  }
//  function createBall (world, x, y, rad, fixed) {
//    var ballSd = new b2CircleDef();
//    if (!fixed) ballSd.density = 1.0;
//    ballSd.radius = rad || 10;
//    ballSd.restitution = 0.2;
//    var ballBd = new b2BodyDef();
//    ballBd.AddShape(ballSd);
//    ballBd.position.Set(x, y);
//    return world.CreateBody(ballBd);
//  }
  function createPoly(world, x, y, points, fixed) {
    var polySd = new $.Engine.Collision.Shape.PolyDef();
    if (!fixed) polySd.density = 1.0;
    polySd.vertexCount = points.length;
    for (var i = 0; i < points.length; i++) {
      polySd.vertices[i].Set(points[i][0], points[i][1]);
    }
    var polyBd = new $.Engine.Dynamic.BodyDef();
    polyBd.AddShape(polySd);
    polyBd.position.Set(x, y);
    return world.CreateBody(polyBd)
  }
  function createBox(world, x, y, width, height, fixed) {
    if (typeof (fixed) == 'undefined') fixed = true;
    var boxSd = new $.Engine.Collision.Shape.BoxDef();
    if (!fixed) boxSd.density = 0.1;
    boxSd.restitution = 0;
    boxSd.friction = 1;
    boxSd.extents.Set(width, height);

    var boxBd = new $.Engine.Dynamic.BodyDef();
    boxBd.linearDamping = 0;
    boxBd.allowSleep = false;
    boxBd.AddShape(boxSd);
//    var element = document.createElement( 'div' );
//    element.style.width = width*2 + 'px';
//    element.style.height = height*2 + 'px';
//    element.innerText = "LEO";	
//	  element.style.position = 'absolute';
//	  element.style.left = -200 + 'px';
//	  element.style.top = -200 + 'px';
//	  element.style.cursor = "default";
//	  element.style.background = '#fff';
//    $('body').append($(element));
//    boxBd.userData = { element: element };
    boxBd.position.Set(x, y);
    return world.CreateBody(boxBd)
  }
  var world;
  var ctx;
  var canvasWidth;
  var canvasHeight;
  var canvasTop;
  var canvasLeft;
  var boxes = [];
  var player = {
    object: null
  };
  var keys = [];
  function setupWorld() {
    world = createWorld();
    //createPoly(world, 100, 100, [[0, 0], [10, 30], [-30, 0]], false);
  }
  function createWorld() {
    var worldAABB = new $.Engine.Collision.AABB(-1000, -1000, 1000, 1000);
    var gravity = new $.Engine.Math.Vector2D(0, 300);
    var doSleep = true;
    var world = new $.Engine.Dynamic.World(worldAABB, gravity, doSleep);
    createGround(world);
    //    createBox(world, 0, 125, 10, 250);
    //    createBox(world, 500, 125, 10, 250);
    return world;
  }
  $(document).ready(function () {
    setupWorld();
    ctx = $('canvas')[0].getContext('2d');
    var canvasElm = $('canvas');
    canvasWidth = parseInt(canvasElm.width());
    canvasHeight = parseInt(canvasElm.height());
    canvasTop = parseInt(canvasElm.offset().top);
    canvasLeft = parseInt(canvasElm.offset().left);
    player.object = createBox(world, 500 - canvasLeft, 375 - canvasTop, 10, 10, false);
    window.addEventListener('keydown', handleKeyDown, true);
    window.addEventListener('keyup', handleKeyUp, true);
    function handleKeyDown(evt) {
      keys[evt.keyCode] = true;
    }


    function handleKeyUp(evt) {
      keys[evt.keyCode] = false;
    }
    $('canvas').click(function (e) {
      //setupNextWorld();
      //      if (Math.random() < 0.5)
      //        demos.top.createBall(world, Event.pointerX(e) - canvasLeft, Event.pointerY(e) - canvasTop);
      //      else
      boxes.push(createBox(world, e.clientX - canvasLeft, e.clientY - canvasTop, 10, 10, false));
    });
    $('canvas').bind('contextmenu', function (e) {
      if (e.preventDefault) e.preventDefault();
      setupPrevWorld();
      return false;
    });
    step();
    //    window.setInterval(function () {
    //      if (boxes.length == 0) return;
    //      var index = parseInt(Math.random() * boxes.length - 1);
    //      world.DestroyBody(boxes[index]);
    //      boxes.splice(index, 1);

    //    }, 3000);

    //    $.Engine.Game.Initial({
    //      canvas: $('#canvas'),
    //      FPS: 20,
    //      sampleFPS: true,
    //      runloop: function () {
    //        $('#FPS').text($.Engine.Render.ActualFPS);
    //      }
    //    });
    //    $.Engine.Game.Start();
  });

  function step(cnt) {
    var stepping = false;
    var timeStep = 1.0 / 60;
    var iteration = 1;
    handleInteractions();
    world.Step(timeStep, iteration);
    WorldMonitor(world);
    ctx.clearRect(0, 0, canvasWidth, canvasHeight);
    drawWorld(world, ctx);
    setTimeout('step(' + (cnt || 0) + ')', 10);
  }
  function handleInteractions() {
    // up arrow

    var vel = player.object.GetLinearVelocity();
    if (keys[38]) {
      vel.y = -150;
    }

    // left/right arrows
    if (keys[37]) {
      vel.x = -60;
    }
    else if (keys[39]) {
      vel.x = 60;
    }


    player.object.SetLinearVelocity(vel);
  }
  var world_bodycount = $('#world_bodycount');
  var world_contactcount = $('#world_contactcount');
  function WorldMonitor(world) {
    world_bodycount.text(world.m_bodyCount);
    world_contactcount.text(world.m_contactCount);

  }
</script>
</body>
</html>
